class Specter {
  constructor() {
    // 1.创建div并设置样式
    let oDiv = document.createElement("div");
    // oDiv.className = "specter";
    oDiv.style.top = "1000px";
    oDiv.style.left = Math.random() * 1500 + "px";
    // 2.创建span并设置内容
    let oSpan = document.createElement("span");
    // oSpan.innerText = "m";
    let key = this.generateKey();
    oSpan.innerText = key;
    oDiv.className = "specter " + key;
    // 3.将span添加到div中
    oDiv.appendChild(oSpan);
    // 4.将div添加到body中
    document.body.appendChild(oDiv);
    this.oDiv = oDiv;
  }
  bomb () {
    // 1.删除当前的幽灵
    document.body.removeChild(this.oDiv);
    // 2.删除当前幽灵对应的定时器
    clearInterval(this.timer);
  }
  fly () {
    // 1.获取幽灵当前的top值
    let offset = parseInt(this.oDiv.style.top);
    this.timer = window.setInterval(() => {
      offset -= 20;
      if (offset <= -300) {
        this.bomb();
      }
      this.oDiv.style.top = offset + "px";
    }, 200);
  }
  generateKey () {
    let num = Math.floor(Math.random() * (90 - 65 + 1)) + 65;
    return String.fromCharCode(num);
  }
}